<template>
  <div class="app-container customer-div">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="投票活动" name="first">
        <div style="margin-top: 20px">
          <!--搜索-->
          <el-form :inline="true" :model="listQuery" size="mini" label-width="100px">
            <el-form-item label="投票活动名称：">
              <el-input v-model="listQuery.activityName"></el-input>
            </el-form-item>
            <el-form-item label="状态：">
              <el-select v-model="listQuery.activityState" clearable>
                <el-option
                        v-for="item in typeList"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button
                      @click="handleSearchList()"
                      type="primary">
                查询
              </el-button>
            </el-form-item>
            <el-form-item>
              <el-button
                      @click="showAddPop()"
                      type="success">
                新建投票活动
              </el-button>
            </el-form-item>

          </el-form>
        </div>
        <!--数据列表-->
        <div class="table-container">
          <el-table
                  v-loading="loading"
                  :data="list"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column
                    prop="activityName"
                    label="投票活动名称"
                    align="center"
                    min-width="150">
            </el-table-column>
            <el-table-column
                    prop="templateName"
                    label="投票模板"
                    align="center"
                    min-width="100">
            </el-table-column>
            <el-table-column
                    label="自评时间"
                    align="center"
                    min-width="180">
              <template slot-scope="scope">{{scope.row.selfStartTime}} 至 {{scope.row.selfEndTime}}</template>
            </el-table-column>
            <el-table-column
                    label="投票时间"
                    align="center"
                    min-width="180">
              <template slot-scope="scope">{{scope.row.evaluateStartTime}} 至 {{scope.row.evaluateEndTime}}</template>
            </el-table-column>

            <el-table-column
                    align="center"
                    prop="operateSource"
                    label="状态"
                    min-width="100">
              <template slot-scope="scope">{{scope.row.activityState | fifState}}</template>
            </el-table-column>
            <el-table-column
                    label="被投人数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.usedUserNum }}
              </template>
            </el-table-column>
            <el-table-column
                    label="投票总数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.evaluateNum }}
              </template>
            </el-table-column>
            <el-table-column
                    label="实际投票数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.actualEvaluateNum }}
              </template>
            </el-table-column>
            <el-table-column
                    label="创建时间"
                    min-width="180"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.createTime }}
              </template>
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                <el-button type="text" @click="toInfo(scope.row)">查看</el-button>
                <el-button type="text" v-if="scope.row.activityState == 0 || scope.row.activityState == 20" @click="cancel(scope.row)">取消</el-button>
              </template>
            </el-table-column>

          </el-table>
        </div>
        <div class="pagination-container">
          <el-pagination
                  background
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  layout="total, sizes,prev, pager, next,jumper"
                  :current-page.sync="listQuery.pageNum"
                  :page-size="listQuery.pageSize"
                  :page-sizes="[10,15,20]"
                  :total="count">
          </el-pagination>
        </div>
      </el-tab-pane>
      <el-tab-pane label="投票明细" name="second">
         <div>
           <el-alert
                   title="员工自评完成后，生成投票记录，投票时间开始后，投票人才可以投票"
                   type="warning"
                   :closable="false">
           </el-alert>
           </div>
        <div style="margin-top: 20px">
          <!--搜索-->
          <el-form :inline="true" :model="listQuery2" size="mini" label-width="100px">
            <el-form-item label="投票活动名称：">
              <el-input v-model="listQuery2.activityName"></el-input>
            </el-form-item>
<!--            <el-form-item label="部门：">-->
<!--              <el-cascader-->
<!--                      v-model="listQuery2.departmentId"-->
<!--                      :options="data2"-->
<!--                      :props="{ checkStrictly: true,value:'departmentId',label:'departmentName',emitPath:false}"-->
<!--                      clearable>-->
<!--              </el-cascader>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="被投人：">-->
<!--              <el-select v-model="listQuery2.userId" filterable placeholder="请选择" clearable>-->
<!--                <el-option-->
<!--                        v-for="item in userOptionList"-->
<!--                        :key="item.userId"-->
<!--                        :label="item.realName"-->
<!--                        :value="item.userId">-->
<!--                </el-option>-->
<!--              </el-select>-->
<!--            </el-form-item>-->
            <el-form-item label="被投人：">
              <el-cascader
                      :show-all-levels="false"
                      collapse-tags
                      v-model="listQuery2.userId"
                      :options="data3"
                      :props="{ value:'id',label:'name',multiple: true,emitPath:false}"
                      clearable>
              </el-cascader>
            </el-form-item>
            <el-form-item label="状态：">
              <el-select v-model="listQuery2.evaluateState" clearable>
                <el-option
                        v-for="item in typeList2"
                        :key="item.code"
                        :label="item.name"
                        :value="item.code">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button
                      @click="handleSearchList2()"
                      type="primary">
                查询
              </el-button>
              <el-button
                      :loading="btnloading2"
                      @click="downloadExcel2()">
                导出
              </el-button>
            </el-form-item>
          </el-form>
        </div>
        <!--数据列表-->
        <div class="table-container">
          <el-table
                  v-loading="loading2"
                  :data="list2"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column
                    prop="activityName"
                    label="投票活动名称"
                    align="center"
                    min-width="150">
            </el-table-column>
            <el-table-column
                    prop="departName"
                    label="部门"
                    align="center"
                    min-width="100">
            </el-table-column>
            <el-table-column
                    label="被投人"
                    align="center"
                    min-width="100">
              <template slot-scope="scope">{{scope.row.userRealName}}</template>
            </el-table-column>
            <el-table-column
                    align="center"
                    prop="operateSource"
                    label="投票时间"
                    min-width="150">
              <template slot-scope="scope">{{scope.row.evaluateTime }}</template>
            </el-table-column>
            <el-table-column
                    label="投票状态"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.evaluateState }}
              </template>
            </el-table-column>
            <!--<el-table-column-->
                    <!--label="投票分数"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--{{scope.row.evaluateScores }}-->
              <!--</template>-->
            <!--</el-table-column>-->
            <el-table-column
                    label="百分制分数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.evaluateScores }}
              </template>
            </el-table-column>

            <!--<el-table-column-->
                    <!--label="关系"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--{{scope.row.userType }}-->
              <!--</template>-->
            <!--</el-table-column>-->
            <!--<el-table-column-->
                    <!--label="评分类型"-->
                    <!--align="center"-->
                    <!--min-width="100">-->
              <!--<template slot-scope="scope">{{scope.row.isDepartManage == 0 ? '员工' : '部门负责人'}}</template>-->
            <!--</el-table-column>-->

            <!--<el-table-column-->
                    <!--label="投票人"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--{{scope.row.evaluatorName }}-->
              <!--</template>-->
            <!--</el-table-column>-->



            <!--<el-table-column-->
                    <!--fixed="right"-->
                    <!--label="操作"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--<el-button type="text" @click="toStaffAct(scope.row)">查看</el-button>-->
              <!--</template>-->
            <!--</el-table-column>-->

          </el-table>
        </div>
        <div class="pagination-container">
          <el-pagination
                  background
                  @size-change="handleSizeChange2"
                  @current-change="handleCurrentChange2"
                  layout="total, sizes,prev, pager, next,jumper"
                  :current-page.sync="listQuery2.pageNum"
                  :page-size="listQuery2.pageSize"
                  :page-sizes="[10,15,20]"
                  :total="count2">
          </el-pagination>
        </div>

      </el-tab-pane>
      <el-tab-pane label="投票统计" name="third">
        <div style="margin-top: 20px">
          <!--搜索-->
          <el-form :inline="true" :model="listQuery3" size="mini" label-width="100px">
            <el-form-item label="投票活动名称：">
              <el-input v-model="listQuery3.activityName"></el-input>
            </el-form-item>
<!--            <el-form-item label="部门：">-->
<!--              <el-cascader-->
<!--                      v-model="listQuery3.departmentId"-->
<!--                      :options="data2"-->
<!--                      :props="{ checkStrictly: true,value:'departmentId',label:'departmentName',emitPath:false}"-->
<!--                      clearable>-->
<!--              </el-cascader>-->
<!--            </el-form-item>-->
<!--            <el-form-item label="被投人：">-->
<!--              <el-select v-model="listQuery3.userId" filterable placeholder="请选择" clearable>-->
<!--                <el-option-->
<!--                        v-for="item in userOptionList"-->
<!--                        :key="item.userId"-->
<!--                        :label="item.realName"-->
<!--                        :value="item.userId">-->
<!--                </el-option>-->
<!--              </el-select>-->
<!--            </el-form-item>-->
            <el-form-item label="被投人：">
              <el-cascader
                      :show-all-levels="false"
                      collapse-tags
                      v-model="listQuery3.userId"
                      :options="data3"
                      :props="{ value:'id',label:'name',multiple: true,emitPath:false}"
                      clearable>
              </el-cascader>
            </el-form-item>
            <el-form-item label="评分类型：">
              <el-select v-model="listQuery3.isDepartManage" clearable>
                <el-option
                        :key="0"
                        label="员工"
                        :value="0">
                </el-option>
                <el-option
                        :key="1"
                        label="部门负责人"
                        :value="1">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="是否写自评：">
              <el-select v-model="listQuery3.isHasSelfInput" clearable>
                <el-option
                        :key="0"
                        label="否"
                        :value="0">
                </el-option>
                <el-option
                        :key="1"
                        label="是"
                        :value="1">
                </el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-button
                      @click="handleSearchList3()"
                      type="primary">
                查询
              </el-button>
              <el-button @click="downloadExcel">
                导出
              </el-button>
            </el-form-item>
          </el-form>
        </div>
        <!--数据列表-->
        <div class="table-container">
          <el-table
                  v-loading="loading3"
                  :data="list3"
                  border
                  style="width: 100%; margin-top: 20px">
            <el-table-column
                    prop="activityName"
                    label="投票活动名称"
                    align="center"
                    min-width="150">
            </el-table-column>
            <el-table-column
                    prop="departName"
                    label="部门"
                    align="center"
                    min-width="100">
            </el-table-column>
            <el-table-column
                    label="评分类型"
                    align="center"
                    min-width="100">
              <template slot-scope="scope">{{scope.row.isDepartManage == 0 ? '员工' : '部门负责人'}}</template>
            </el-table-column>
            <el-table-column
                    label="被投人"
                    align="center"
                    min-width="100">
              <template slot-scope="scope">{{scope.row.userRealName}}</template>
            </el-table-column>
            <!--<el-table-column-->
                    <!--align="center"-->
                    <!--prop="operateSource"-->
                    <!--label="自评截止时间"-->
                    <!--min-width="100">-->
              <!--<template slot-scope="scope">-->
                 <!--{{scope.row.selfEndTime}}-->
              <!--</template>-->
            <!--</el-table-column>-->
            <!--<el-table-column-->
                    <!--label="投票截止时间"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--{{scope.row.evaluateEndTime}}-->
              <!--</template>-->
            <!--</el-table-column>-->
            <el-table-column
                    label="状态"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.evaluateState }}
              </template>
            </el-table-column>
            <el-table-column
                    label="投票人数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.evaluateNum }}
              </template>
            </el-table-column>
            <el-table-column
                    label="实际投票人数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.actualEvaluateNum }}
              </template>
            </el-table-column>
            <el-table-column
                    label="上级已投票人数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.parentHasEvaluateNum }}
              </template>
            </el-table-column>
            <el-table-column
                    label="弃权人数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.abstainNum }}
              </template>
            </el-table-column>
            <el-table-column
                    label="未投人数"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.unEvaluateNum}}
              </template>
            </el-table-column>
            <!--<el-table-column-->
                    <!--label="投票总评分数"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--{{scope.row.allScore }}-->
              <!--</template>-->
            <!--</el-table-column>-->
            <!--<el-table-column-->
                    <!--label="最高分"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--{{scope.row.maxScore }}-->
              <!--</template>-->
            <!--</el-table-column>-->
            <!--<el-table-column-->
                    <!--label="最低分"-->
                    <!--min-width="100"-->
                    <!--align="center">-->
              <!--<template slot-scope="scope">-->
                <!--{{scope.row.minScore }}-->
              <!--</template>-->
            <!--</el-table-column>-->
            <el-table-column
                    label="最终得分"
                    min-width="100"
                    align="center">
              <template slot-scope="scope">
                {{scope.row.actualScore }}
              </template>
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    min-width="150"
                    align="center">
                <template slot-scope="scope">
                  <el-button type="text" @click="seeZp(scope.row)">自评</el-button>
                  <!--<el-button type="text" @click="toMxList(scope.row)">投票记录</el-button>-->
                </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="pagination-container">
          <el-pagination
                  background
                  @size-change="handleSizeChange3"
                  @current-change="handleCurrentChange3"
                  layout="total, sizes,prev, pager, next,jumper"
                  :current-page.sync="listQuery3.pageNum"
                  :page-size="listQuery3.pageSize"
                  :page-sizes="[10,15,20]"
                  :total="count3">
          </el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>

    <!--新建投票模板--->
    <el-dialog
            :close-on-click-modal="false"
            title="新建投票活动"
            :beforeClose="handleClose"
            :visible.sync="dialogVisible"
            width="600px">
      <el-form :model="addForm" size="mini" label-width="120px" :rules="rules" ref="addForm">
        <el-form-item label="投票名称：" prop="activityName">
          <el-input v-model="addForm.activityName" ></el-input>
        </el-form-item>
        <el-form-item label="投票模板：" prop="templateId">
          <el-select v-model="addForm.templateId">
            <el-option v-for="item in templateList" :key="item.templateId" :value="item.templateId" :label="item.templateName" v-if="item.isEnable == 1"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="自评时间" prop="selfEvaluateTime">
          <!--:picker-options="isDisabled"-->
          <el-date-picker
                  :picker-options="isDisabled"
                  format="yyyy 年 MM 月 dd 日"
                  v-model="addForm.selfEvaluateTime"
                  :default-time="['00:00:00', '23:59:59']"
                  type="daterange"
                  value-format="yyyy-MM-dd"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="投票时间" prop="otherEvaluateTime">
          <el-date-picker
                  format="yyyy 年 MM 月 dd 日"
                  :picker-options="isDisabled"
                  v-model="addForm.otherEvaluateTime"
                  :default-time="['00:00:00', '23:59:59']"
                  type="daterange"
                  value-format="yyyy-MM-dd"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="适用人群：" prop="userIdsText">
          <el-button type="text" @click="showChooseRQ">选择人适用人群</el-button>
          <div style="padding:12px;background: #fff;border:1px solid #DCDFE6;border-radius: 4px" v-show="addForm.tags.length > 0">
            <el-tag
                    style="margin-bottom:8px;margin-right:8px"
                    v-for="(tag,index) in addForm.tags"
                    :key="tag.id"
                    @close="closeTag(index)"
                    closable
                    type="success">
              {{tag.name}}
            </el-tag>
          </div>
          <el-input v-model="addForm.userIdsText" type="hidden" style="height:0"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose">取 消</el-button>
          <el-button type="primary" @click="handleConfirm" :loading="btnLoading">确 定</el-button>
      </span>
    </el-dialog>

    <!--选择适用人群--->
    <el-dialog
            :close-on-click-modal="false"
            title="选择适用人群"
            :beforeClose="handleClose2"
            :visible.sync="dialogVisible2"
            width="600px">
      <el-row :gutter="20">
        <el-col :span="12" style="max-height:400px;overflow: auto">
          <el-tree
                  @check="nodeClick"
                  :data="data"
                  show-checkbox
                  node-key="id"
                  ref="tree"
                  highlight-current
                  :props="defaultProps">
          </el-tree>
        </el-col>
        <el-col :span="12">
          <div style="border-left:1px solid rgb(220, 223, 230);height: 400px;overflow: auto;padding-left:20px">
            <el-alert
                    :key="item.id"
                    v-for="(item,index) in needNodes"
                    style="margin-bottom:10px"
                    :title="item.name"
                    @close="closeRQitem(index)"
                    type="success">
            </el-alert>
          </div>
        </el-col>
      </el-row>
      <span slot="footer" class="dialog-footer">
              <el-button @click="handleClose2">取 消</el-button>
              <el-button type="primary" @click="handleConfirm2">确 定</el-button>
          </span>
    </el-dialog>

    <!--投票明细-->
    <el-dialog
            :close-on-click-modal="false"
            :title="title4"
            :visible.sync="dialogVisible4"
            width="900px">
      <!--搜索-->
      <el-form :inline="true" :model="listQuerypop" size="mini" label-width="100px">
        <el-form-item label="部门：">
          <el-cascader
                  v-model="listQuerypop.departmentId"
                  :options="data2"
                  :props="{ checkStrictly: true,value:'departmentId',label:'departmentName',emitPath:false}"
                  clearable>
          </el-cascader>
        </el-form-item>

        <el-form-item label="状态：">
          <el-select v-model="listQuerypop.evaluateState" clearable>
            <el-option
                    v-for="item in typeList2"
                    :key="item.code"
                    :label="item.name"
                    :value="item.code">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
                  @click="handleSearchListpop()"
                  type="primary">
            查询
          </el-button>
        </el-form-item>
      </el-form>
      <div class="table-container">
        <el-table
                v-loading="loadingpop"
                :data="listpop"
                border
                style="width: 100%; margin-top: 20px">
          <el-table-column
                  prop="activityName"
                  label="投票活动名称"
                  align="center"
                  min-width="150">
          </el-table-column>
          <el-table-column
                  prop="departName"
                  label="部门"
                  align="center"
                  min-width="100">
          </el-table-column>
          <el-table-column
                  label="评分类型"
                  align="center"
                  min-width="100">
            <template slot-scope="scope">{{scope.row.isDepartManage == 0 ? '员工' : '部门负责人'}}</template>
          </el-table-column>
          <el-table-column
                  label="被投人"
                  align="center"
                  min-width="100">
            <template slot-scope="scope">{{scope.row.userRealName}}</template>
          </el-table-column>

          <el-table-column
                  align="center"
                  prop="operateSource"
                  label="投票时间"
                  min-width="150">
            <template slot-scope="scope">{{scope.row.evaluateTime }}</template>
          </el-table-column>
          <el-table-column
                  label="投票人"
                  min-width="100"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.evaluatorName }}
            </template>
          </el-table-column>
          <el-table-column
                  label="关系"
                  min-width="100"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.userType }}
            </template>
          </el-table-column>
          <el-table-column
                  label="投票状态"
                  min-width="100"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.evaluateState }}
            </template>
          </el-table-column>
          <el-table-column
                  label="投票分数"
                  min-width="100"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.evaluateScores }}
            </template>
          </el-table-column>
          <el-table-column
                  fixed="right"
                  label="操作"
                  min-width="100"
                  align="center">
            <template slot-scope="scope">
              <el-button type="text" @click="toStaffAct(scope.row)">查看</el-button>
            </template>
          </el-table-column>

        </el-table>
      </div>
      <div style="overflow: hidden">
        <div class="pagination-container">
          <el-pagination
                  background
                  @size-change="handleSizeChangepop"
                  @current-change="handleCurrentChangepop"
                  layout="total, sizes,prev, pager, next,jumper"
                  :current-page.sync="listQuerypop.pageNum"
                  :page-size="listQuerypop.pageSize"
                  :page-sizes="[10,15,20]"
                  :total="countpop">
          </el-pagination>
        </div>
      </div>


    </el-dialog>


    <el-dialog
            :close-on-click-modal="false"
            title="自评"
            :visible.sync="dialogVisible3"
            width="600px">
      <el-form  size="mini" label-width="140px" >
        <el-form-item :label="item.itemName" v-for="item in form.itemList" :key="item.itemId" >
          <div v-html="item.evaluateContent"></div>
        </el-form-item>
        <el-form-item label="操作记录：">
          <el-timeline-item
                  v-for="(activity, index) in form.logList"
                  :key="index" style="list-style:none">
                       <div style="padding-right:10px;">{{activity.logTime}}</div>
                       <div v-html="activity.logContent"></div>
          </el-timeline-item>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
              <el-button @click="handleClose3" size="small">关 闭</el-button>
          </span>
    </el-dialog>

  </div>
</template>

<script>
  import { staffsLogList,listByDept,addActivity,getTemplateList,activityList,activityEvaluator,evaluateAnalysis,getUserOption,selfEvaluateInfo,activityChange} from '@/api/partner'
  import {getDeptList,listByDepartMange} from '@/api/management'
  import {formatDate} from '@/utils/date';
  import store from '@/store'
  import { mapGetters } from 'vuex'
  const defaultListQuery = {
    activityName:'',
    activityState:'',
    pageNum:1,
    pageSize:10,
  };

  const defaultListQuery2 = {
    activityId:'',
    activityName:'',
    departmentId:'',
    evaluateState :'',
    userId:'',
    pageNum:1,
    pageSize:10,
  };

  const defaultListQuery3 = {
    activityId:'',
    activityName:'',
    departmentId:'',
    isDepartManage :'',
    userId:'',
    isHasSelfInput:'',
    pageNum:1,
    pageSize:10,
  };
  const defaultAddForm = {
    activityName:'',
    templateId:'',
    selfEvaluateTime:[],
    otherEvaluateTime:[],
    tags:[],
    userIdsText:''
  };

  const defaultForm = {
    activityName:'',
    itemList:[],
    logList:[]

  };
  export default {
    name: "index",
    data(){
      const otherEvaluateTime = (rule, value, callback)=> {
        if (value.length == 0) {
          callback(new Error('请选择投票时间'))
        }else if( this.addForm.selfEvaluateTime.length > 0 && (new Date(value[0]).getTime() <= new Date(this.addForm.selfEvaluateTime[1]).getTime())){
          callback(new Error('投票时间需大于自评时间'))
        }else{
          callback()
        }
      };
      return{
        roles:store.getters.roles ? store.getters.roles : [],
        listQuery:JSON.parse(JSON.stringify(defaultListQuery)),
        list:[],
        count:0,
        loading:false,

        listQuery2:JSON.parse(JSON.stringify(defaultListQuery2)),
        list2:[],
        count2:0,
        loading2:false,

        listQuery3:JSON.parse(JSON.stringify(defaultListQuery3)),
        list3:[],
        count3:0,
        loading3:false,


        listQuerypop:JSON.parse(JSON.stringify(defaultListQuery2)),
        listpop:[],
        countpop:0,
        loadingpop:false,
        dialogVisible4:false,
        title4:'',

        userOptionList:[],
        data2:[],
        sourceList:[{name:'pc',code:'pc'},{name:'手机',code:'mobile'}],
        typeList:[{name:'未开始',code:0},{name:'自评中',code:15},{name:'进行中',code:20},{name:'已结束',code:30},{name:'已取消',code:10}],
        typeList2:[{name:'待投票',code:0},{name:'已投票',code:10},{name:'弃权',code:20}],
        activeName:'first',
        addForm:JSON.parse(JSON.stringify(defaultAddForm)),
        dialogVisible:false,
        rules:{
          activityName:[{required: true, trigger: 'blur' ,message: '请输入投票活动名称'}],
          templateId:[{required: true, trigger: 'change' ,message: '请选择投票模版'}],
          selfEvaluateTime:[{required: true, trigger: 'change' ,message: '请选择自评时间'}],
          otherEvaluateTime:[{required: true, trigger: 'change' ,validator: otherEvaluateTime}],
          userIdsText:[{required: true, trigger: 'change' ,message: '请选择适用人群'}]
        },
        btnLoading:false,

        dialogVisible2:false,
        activeName2:'first',
        data: [],
        defaultProps: {
          children: 'children',
          label: 'name',
        },
        needNodes:[],
        templateList:[],
        isDisabled: {
          disabledDate(time) {
            // 设置日期限制 小于某个日期不能选择
            return time.getTime() < new Date().getTime() - 8.64e7;
          }
        },
        dialogVisible3:false,
        form:JSON.parse(JSON.stringify(defaultForm)),
        data3:[],
        btnloading2:false
      }
    },
    computed: {
      ...mapGetters([
        'name',
        'mobile',
        'userId'
      ]),

    },
    created() {
      this.getList();
      this.getList2();
      this.getList3()
      this.getDataList();
      this.getTList();
      this.getUserOptionList();
      this.getBuMenList();

      this.getDataList2();
    },

    filters: {
      fifState(val) {
        if(val == 0 ){
          return '未开始'
        }else if(val == 10){
          return '已取消'
        }else if(val == 15){
          return '自评中'
        }else if(val == 20){
          return '进行中'
        }else if(val == 30){
          return '已结束'
        }
      },
    },
    methods:{

        //下载excle
        downloadExcel2(){
            let data = JSON.parse(JSON.stringify(this.listQuery2));
            data.isExport = 1;
            activityEvaluator(data).then((res)=>{
                require.ensure([], () => {
                    const { export_json_to_excel } = require('sheet/Export2Excel');
                    const tHeader = res.title;
                    const filterVal = res.columns;
                    const list = res.list;
                    const data = this.formatJson(filterVal, list);
                    export_json_to_excel(tHeader, data, res.fileName);
                })
            })
        },

      //下载excle
      downloadExcel(){
        let data = JSON.parse(JSON.stringify(this.listQuery3));
        data.isExport = 1;
        evaluateAnalysis(data).then((res)=>{
          require.ensure([], () => {
            const { export_json_to_excel } = require('sheet/Export2Excel');
            const tHeader = res.title;
            const filterVal = res.columns;
            const list = res.list;
            const data = this.formatJson(filterVal, list);
            export_json_to_excel(tHeader, data, res.fileName);
          })
        })
      },

      //下载表格数据格式化
      formatJson(filterVal, jsonData) {
        return jsonData.map(v => filterVal.map(j => v[j]))
      },

      //取消投票
      cancel(item){
        this.$confirm('是否确认取消此项投票活动?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          activityChange({activityId:item.activityId,isEnable:0}).then(()=>{
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.getList();
          })

        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          });
        });
      },
      //去员工投票页
      toStaffAct(item){
        let routeData = this.$router.resolve({name:'staffActivity',query:{eId:item.eId}});
        window.open(routeData.href);
      },

      //显示自评
      seeZp(item){
        this.dialogVisible3 = true;
        selfEvaluateInfo({auId:item.auId}).then((res)=>{
          this.form.itemList = res.itemList;
          this.form.logList = res.logList;
        })
      },
      //关闭自评
      handleClose3(){
        this.dialogVisible3 = false;
      },


      //去详情页
      toInfo(item){
        let routeData = this.$router.resolve({name:'activityInfo',query:{activityId:item.activityId}});
        window.open(routeData.href);
      },
      //查看投票明细
      toMxList(item){
          this.listQuerypop.activityId = item.activityId;
          this.listQuerypop.activityName = item.activityName;
          this.title4 = item.activityName + '投票明细';
          this.listQuerypop.userId = item.userId;
          this.handleSearchListpop();
          this.dialogVisible4 = true;
      },

      handleSearchListpop(){
        this.listQuerypop.pageNum = 1;
        this.getListpop();
      },

      //获取活动列表
      getListpop(){
        this.loadingpop = true;
        let data = JSON.parse(JSON.stringify(this.listQuerypop));
        activityEvaluator(data).then((res)=>{
          this.listpop = res.list;
          this.countpop = res.count;
          this.loadingpop = false;
        }).catch(()=>{
          this.loadingpop = false;
        })
      },

      handleSizeChangepop(val){
        this.listQuerypop.pageNum = 1;
        this.listQuerypop.pageSize = val;
        this.getListpop();
      },
      handleCurrentChangepop(val){
        this.listQuerypop.pageNum = val;
        this.getListpop();
      },


      //获取部门列表
      getBuMenList(){
        getDeptList().then((res)=>{
          this.data2 = [];
          this.data2 = this.forTree(res);
        })
      },
      //去除不要的children
      forTree(list){
        let newList = list;
        if(newList.length){
          for (let i = 0; i<newList.length; i++){
            if(newList[i].children && newList[i].children.length > 0){
              this.forTree(newList[i].children)
            }else{
              delete newList[i].children;
            }
          }
          return newList
        }
      },

      //获取员工下拉选项
      getDataList2(){
        listByDept().then((res)=>{
          this.data3 = [];
          this.data3 = this.forTree2(res);
        })
      },

      //去除children.length = 0 的项
      forTree2(list){
        let newList = list;
        if(newList.length){
          for (let i = 0; i<newList.length; i++){
            if(newList[i].children && newList[i].children.length > 0){
              this.forTree2(newList[i].children)
            }else if(newList[i].children && newList[i].children.length == 0){
              console.log("newList[i]",newList[i])
              delete newList[i];
            }
          }
          return newList
        }
      },

      //获取员工下拉选项
      getUserOptionList(){
        getUserOption().then((res)=>{
          this.userOptionList = res;
        })
      },

      closeTag(index){
        this.addForm.tags.splice(index,1);
        this.addForm.userIdsText = [];
        this.addForm.tags.forEach((el)=>{
          this.addForm.userIdsText.push(el.id)
        });
        this.addForm.userIdsText = this.addForm.userIdsText.join(",")
      },

      //获取模版列表
      getTList(){
        getTemplateList().then((res)=>{
          this.templateList = res
        })
      },
      //点击部门
      nodeClick(){
        this.needNodes = JSON.parse(JSON.stringify(this.$refs.tree.getCheckedNodes(true)));
      },
      //删除适用人群
      closeRQitem(index){
        this.needNodes.splice(index,1);
        this.$refs.tree.setCheckedNodes(this.needNodes);
      },

      //显示适用人群
      showChooseRQ(){
        this.dialogVisible2 = true;
        this.needNodes = JSON.parse(JSON.stringify(this.addForm.tags));
        // if(this.needNodes.length > 0){
        //   this.$refs.tree.setCheckedNodes(this.needNodes);
        // }
        this.$refs.tree.setCheckedNodes(this.needNodes);

      },

      //关闭适用人群
      handleClose2(){
        this.dialogVisible2 = false;
      },

      //确认适用人群
      handleConfirm2(){
        this.dialogVisible2 = false;
        this.addForm.tags = JSON.parse(JSON.stringify(this.needNodes));
        this.addForm.userIdsText = [];
        this.addForm.tags.forEach((el)=>{
          this.addForm.userIdsText.push(el.id)
        });
        this.addForm.userIdsText = this.addForm.userIdsText.join(",")
      },

      handleClick(){

      },

      //显示新建弹窗
      showAddPop(){
        this.dialogVisible = true;
        this.addForm = JSON.parse(JSON.stringify(defaultAddForm))
      },

      //关闭新建
      handleClose(){
        this.dialogVisible = false;
      },

      //提交新建
      handleConfirm(){
        this.$refs.addForm.validate((valid) => {
          if (valid) {
            let data = {};
            this.btnLoading = true;
            data.activityName = this.addForm.activityName;
            data.templateId = this.addForm.templateId;
            data.selfEvaluateTime = this.addForm.selfEvaluateTime;
            data.otherEvaluateTime = this.addForm.otherEvaluateTime;
            data.userIds = [];
            this.addForm.tags.forEach((el)=>{
              data.userIds.push(el.id)
            });
            addActivity(data).then((res)=>{
              this.$message({
                type: 'success',
                message: '操作成功!'
              });
              this.btnLoading = false;
              this.getList();
              this.handleClose();
            }).catch(()=>{
              this.btnLoading = false
            })
          }
        })
      },


      //获取员工下拉选项
      getDataList(){
        listByDepartMange().then((res)=>{
          this.data = res;
        })
      },

      handleSearchList(){
        this.listQuery.pageNum = 1;
        this.getList();
      },

      //获取活动列表
      getList(){
        this.loading = true;
        let data = JSON.parse(JSON.stringify(this.listQuery));
        activityList(data).then((res)=>{
          this.list = res.list;
          this.count = res.count;
          this.loading = false;
        }).catch(()=>{
          this.loading = false;
        })
      },

      handleSizeChange(val){
        this.listQuery.pageNum = 1;
        this.listQuery.pageSize = val;
        this.getList();
      },
      handleCurrentChange(val){
        this.listQuery.pageNum = val;
        this.getList();
      },


      handleSearchList2(){
        this.listQuery2.pageNum = 1;
        this.getList2();
      },

      //获取活动列表
      getList2(){
        this.loading2 = true;
        let data = JSON.parse(JSON.stringify(this.listQuery2));
        activityEvaluator(data).then((res)=>{
          this.list2 = res.list;
          this.count2 = res.count;
          this.loading2 = false;
        }).catch(()=>{
          this.loading2 = false;
        })
      },

      handleSizeChange2(val){
        this.listQuery2.pageNum = 1;
        this.listQuery2.pageSize = val;
        this.getList2();
      },
      handleCurrentChange2(val){
        this.listQuery2.pageNum = val;
        this.getList2();
      },


      handleSearchList3(){
        this.listQuery3.pageNum = 1;
        this.getList3();
      },

      //获取活动列表
      getList3(){
        this.loading3 = true;
        let data = JSON.parse(JSON.stringify(this.listQuery3));
        evaluateAnalysis(data).then((res)=>{
          this.list3 = res.list;
          this.count3 = res.count;
          this.loading3 = false;
        }).catch(()=>{
          this.loading3 = false;
        })
      },

      handleSizeChange3(val){
        this.listQuery3.pageNum = 1;
        this.listQuery3.pageSize = val;
        this.getList3();
      },
      handleCurrentChange3(val){
        this.listQuery3.pageNum = val;
        this.getList3();
      },

    },
  }
</script>

<style scoped lang="scss">

</style>
